<template>
	<view class="poFixed wPer100 hPer100 backCol0a0a0aS5 zIndex1 top0 left0"
		v-show="departureFrame" @touchmove.stop.prevent
	>
		<view class="poFixed top50P left50P trTrn50Pn50P backColWhite borRad30r w700r overHid bSha0010u0rgb00001">
			<view class="lh96r poRel foWeiBold f30r pl30r borB1SCcc teAliCenter">
				<text>
					已支付的订单
					- {{
						departureType == 1 ? '续单' :
						departureType == 2 ? '开门' : departureType
					}}
				</text>
				<image src="/static/icons/iconClose.png" mode="aspectFit"
					class="w50r h50r poAbs rig20r top26r" @click="cliClose"
				></image>
			</view>
			<scroll-view scroll-y="true" class="h800r col999 pl20r pr20r boSiBorBox backColF5f5f5 poRel">
				<view class="mt30r backColWhite overHid borRad10r boxSha5a5a1099c043"
					v-for="item in orderList0" :key="item.id"
				>
					<view class="disFlex lh60r pl20r f28r colFff backImgLiGrTR2c6739a99c043">
						<view class="w140r">
							订单号：
						</view>
						<view class="flex1 woBrBrAll webLiCl1 webBoxOrVer overHid disWebBox">
							{{item.out_trade_no}}
						</view>
					</view>
					<view class="pl20r pr20r pb20r">
						<view class="disFlex mt20r">
							<view class="w140r">
								房间名：
							</view>
							<view class="flex1 foWeiBold col313131">
								{{item.room_info.name}}
							</view>
						</view>
						<view class="disFlex mt20r">
							<view class="w140r">
								服务时间：
							</view>
							<view class="flex1">
								<view>
									{{item.start_time}}
								</view>
								<view>
									{{item.end_time}}
								</view>
							</view>
						</view>
						<view class="disFlex mt20r">
							<view class="w140r">
								创建时间：
							</view>
							<view class="flex1">
								{{item.date}}
							</view>
						</view>
						<view class="disFlex mt20r">
							<view class="flex1">
								实付金额：
								<text class="colFf3627">
									¥{{item.amount}}
								</text>
							</view>
							<view class="flex1 teAliRight colFff">
								<!-- <view class="w96r lh46r disInBlo teAliCenter bor1SC72d21 colC72d21 borRad25r bSha0a4a10aCcc mr10r"
									@click="cliItemBtn5(item.out_trade_no, item.id)"
								>
									退款
								</view> -->
								<view class="w130r lh46r disInBlo teAliCenter bor1S4d76f4 col3579f7 borRad25r bSha0a4a10aCcc"
									@click="cliItemBtn4(item.out_trade_no, item.id)" v-if="item.make_status == 1"
								>
									一键使用
								</view>
								<view class="w100r lh50r disInBlo teAliCenter backCol409EFF borRad25r bSha0a4a10aCcc mr10r"
									@click="cliItemBtn1(item.id)" v-if="departureType == 2 && item.make_status == 2"
								>
									开门
								</view>
								<view class="w100r lh50r disInBlo teAliCenter backColE6a23c borRad25r bSha0a4a10aCcc"
									@click="cliItemBtn3(item.id)" v-if="departureType == 2 && item.make_status == 2"
								>
									分享
								</view>
								<view class="w100r lh50r disInBlo teAliCenter backCol409EFF borRad25r bSha0a4a10aCcc"
									@click="cliItemBtn2(item)" v-if="departureType == 1 && item.make_status == 2"
								>
									续单
								</view>
							</view>
						</view>
					</view>
				</view>
				<view class="lh140r col999 teAliCenter f24r" v-if="orderList0.length">
					已加载全部已支付（待使用和使用中）的订单
				</view>
				<view class="poAbs top50P left50P trTrn50Pn50P f26r wPer100 teAliCenter" v-if="orderList0.length == 0">
					暂无已支付（待使用和使用中）的订单
				</view>
			</scroll-view>
			<view class="poAbs wPer100 hPer100 backCol0a0a0aS5 top0 left0 f26r" v-show="renewalFrame">
				<view class="poAbs wPer100 left0 top50P trTr0n50P backColWhite borRad10r">
					<view class="lh100r poRel foWeiBold f30r teAliCenter ">
						<text>
							选择续单时间
						</text>
						<image src="/static/icons/iconClose.png" mode="aspectFit"
							class="w50r h50r poAbs rig20r top26r" @click="renewalFrame = false"
						></image>
					</view>
					<view class="borRad10r p20r backColF5f5f5">
						<view class="foWeiBold backColWhite p20r">
							续单是下挂在订单下，不能退款，续单时间最大24小时
						</view>
						<view class="mt20r backColWhite p20r">
							请选择续单小时数：
							<picker @change="picChaFun" :value="picVal" :range="picAry" mode="selector"
								class="lh90r mt10r pl20r pr20r f32r bor1SF5f5f5"
							>
								<view class="disFlex">
									<view class="flex1">
										{{picAry[picVal]}}小时
									</view>
									<view class="w100r teAliRight">
										<image :src="baseUrl + 'iconBottomGreen.png'" mode="aspectFit"
											class="w50r h50r poRel top12r"
										></image>
									</view>
								</view>
							</picker>
						</view>
						<view class="mt20r backColWhite p20r disFlex teAliCenter">
							<view class="flex1">
								<view class="lh66r mAuto col99c043 f28r bor1S99c043 borRad10r wPer90"
									@click="renewalFrame = false"
								>
									取消
								</view>
							</view>
							<view class="flex1">
								<view class="lh70r mAuto colFff f28r backImgLiGrTR2c6739a99c043 borRad10r wPer90"
									@click="renewalDetermine1"
								>
									确定
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>
<script>
import { isPossibleRenewTheOrder, getMemberCardruleInfo,
	unifiedOrder, memberOpenDoor,
	 getUnusedOrder, useTheOrder, isOrderDrawback, getTaeRoomDataInfo } from '@/utils/api.js'
import { baseUrl } from '@/utils/request.js'
import { dateLimit } from '@/utils/utils.js'
export default {
	props: {
		departureFrame: { type: Boolean, default: false },//最外层框 true为显示
		departureType: { type: Number, default: 1 },//1为续单 2为开门
		departureList: { type: Array, default: [] },//订单列表
	},
	data() {
		return {
			baseUrl,
			
			orderList0: [],
			
			renewalNum: 3.5,
			renewalFrame: false,
			renewalData: {},
			picVal: 0,
			picAry: [],
		}
	},
	mounted() {
		//
	},
	methods: {
		getDataList0() {
			//make_status: "1"一键使用后make_status: "2"
			//1 未使用 2 已使用 3 已完成 4 已取消
			getUnusedOrder({//获取已支付未使用的订单
				token: uni.getStorageSync('token')
			}).then(res => {
				console.log(111, res)
				if(res.data && res.data.length) {
					this.orderList0 = res.data;
				}else {
					this.orderList0 = [];
				}
			})
		},
		cliClose() {
			this.$emit('cliClose');
		},
		cliItemBtn1(id) {
			uni.showModal({
				title: '提示', content: '确定此房间开门？', confirmColor: '#99c043',
				success:res1 => {
					if (res1.confirm) {
						uni.showLoading({ mask: true, title: '正在开门中...' })
						memberOpenDoor({
							token: uni.getStorageSync('token'), id
						}).then(res2 => {
							uni.hideLoading()
							if(res2.code == '000000') {
								uni.showModal({
									title: '提示', content: res2.message,
									confirmColor: '#99c043', showCancel: false, confirmText: '我知道了',
									success:res3 => {
										if (res1.confirm) {
											
										}
									}
								})
							}else {
								uni.showModal({
									title: '开门失败', content: res2.message,
									confirmColor: '#99c043', showCancel: false, confirmText: '我知道了',
									success:res3 => {
										if (res1.confirm) {
											
										}
									}
								})
							}
						})
					}
				}
			})
		},
		cliItemBtn2(item) {
			isPossibleRenewTheOrder({
				token: uni.getStorageSync('token'),
				out_trade_no: item.out_trade_no
			}).then(res1 => {
				this.renewalData = item;
				this.renewalNum = res1.data.hour;
				this.picAry = [];
				for(let i = 0.5;i <= this.renewalNum;i+=0.5) {
					this.picAry.push(i)
				}
				this.renewalFrame = true;
			})
		},
		cliItemBtn3(id) {
			this.$emit('openShareFrame', id)
		},
		picChaFun(eee) {
			this.picVal = eee.detail.value
		},
		renewalDetermine1() {
			let startTxt = this.renewalData.end_time.replace(/T/g,' ').replace(/-/g,"/").indexOf('.')>-1?this.renewalData.end_time.replace(/T/g,' ').replace(/-/g,"/").substring(0,this.renewalData.end_time.replace(/T/g,' ').replace(/-/g,"/").indexOf('.')):this.renewalData.end_time.replace(/T/g,' ').replace(/-/g,"/"),
				start_time = dateLimit('', new Date(startTxt)) +  ' ' + (new Date(startTxt).getHours() < 10 ? '0' + new Date(startTxt).getHours() : new Date(startTxt).getHours()) + ':' + (new Date(startTxt).getMinutes() < 10 ? '0' + new Date(startTxt).getMinutes() : new Date(startTxt).getMinutes()),
				addThreeHour = new Date(new Date(startTxt).getTime() + this.picAry[this.picVal] * 60 * 60 * 1000),
				end_time = (dateLimit('', new Date(addThreeHour)) + ' ' + (new Date(addThreeHour).getHours() < 10 ? '0' + new Date(addThreeHour).getHours() : new Date(addThreeHour).getHours()) + ':' + (new Date(addThreeHour).getMinutes() < 10 ? '0' + new Date(addThreeHour).getMinutes() : new Date(addThreeHour).getMinutes()));
			// console.log(11, startTxt)
			// console.log(22, start_time)
			// console.log(33, addThreeHour)
			// console.log(44, end_time)
			// return;
			uni.showActionSheet({
				itemList: ['余额支付', '微信支付'],
				success:res1 => {
					getMemberCardruleInfo({
						token: uni.getStorageSync('token')
					}).then(res2 => {
						if(res1.tapIndex == 0) {
							let orderMoney = 0;
							if(res2.data && res2.data.type == 1) {
								getTaeRoomDataInfo({
									tid: this.renewalData.tid, rid: this.renewalData.rid
								}).then(res3 => {
									let card_discount = res3.data.card_discount ? Number(res3.data.card_discount) : 1;
									orderMoney = Math.round((Math.round((this.picAry[this.picVal]) * 100) / 100 * Number(this.renewalData.price) * card_discount) * 100) / 100;
									uni.showModal({
										title: '提示', content: `确定余额支付${orderMoney}元？`, confirmColor: '#99c043',
										success:res4 => {
											if (res4.confirm) {
												this.renewalDetermine2(1, start_time, end_time, (res2.data && res2.data.type == 1 ? res2.data.id : ''));
											}
										}
									})
								})
							}else {
								orderMoney = Math.round((Math.round((this.picAry[this.picVal]) * 100) / 100 * Number(this.renewalData.price)) * 100) / 100;
								uni.showModal({
									title: '提示', content: `确定余额支付${orderMoney}元？`, confirmColor: '#99c043',
									success:res3 => {
										if (res3.confirm) {
											this.renewalDetermine2(1, start_time, end_time, (res2.data && res2.data.type == 1 ? res2.data.id : ''));
										}
									}
								})
							}
						}else {
							this.renewalDetermine2(2, start_time, end_time, (res2.data && res2.data.type == 1 ? res2.data.id : ''));
						}
					})
				}
			})
		},
		renewalDetermine2(payType, start_time, end_time, card_id) {
			unifiedOrder({
				token: uni.getStorageSync('token'),
				tid: this.renewalData.tid,
				rid: this.renewalData.rid,
				payType,
				start_time,
				end_time,
				order_type: 2,
				order_status: 2,
				sid: '',
				card_id,
				front_out_trade_no: this.renewalData.out_trade_no
			}).then(res1 => {
				console.log('start_time', res1)
				if(payType == 1) {
					let title = '',
						content = '';
					if(res1.code == '000000') {
						title = '预订成功';
						content = '订单号：' + res1.data.out_trade_no;
						this.renewalDetermine3(title, content);
					}else {
						title = '预订失败';
						if(res1.code == '900001' || res1.code == '900002') {
							if(res1.code == '900001') content = '未查询到该店铺余额信息';
							if(res1.code == '900002') content = '余额支付余额不足';
							uni.showModal({
								title, content, cancelText: '我知道了',
								confirmText: '去充值', confirmColor: '#99c043',
								success:res2 => {
									if (res2.confirm) {
										uni.navigateTo({ url: '/pages/index/recharge' })
									} else if (res2.cancel) {
										//关闭面板不刷新订单列表
										this.renewalFrame = false;
										this.$emit('cliClose');
									}
								}
							})
						}else {
							content = res1.message;
							this.renewalDetermine3(title, content);
						}
					}
				}else if(payType == 2) {
					uni.requestPayment({
						provider: 'wxpay',
						timeStamp: res1.data.timeStamp,
						nonceStr: res1.data.nonceStr,
						package: res1.data.package,
						signType: res1.data.signType,
						paySign: res1.data.paySign,
						success:res2 => {
							console.log('支付成功', res2);
							this.renewalDetermine3('预订成功', '支付成功');
						}, fail:err2 => {
							console.log('支付失败-err2', err2);
							this.renewalDetermine3('预订失败', '您已取消支付');
						}
					})
				}
			})
		},
		renewalDetermine3(title, content) {
			uni.showModal({
				title, content, confirmColor: '#99c043', showCancel: false, confirmText: '我知道了',
				success:res1 => {
					if (res1.confirm) {
						this.renewalFrame = false;
						this.$emit('cliClose');
						this.$emit('refreshList');
					}
				}
			})
		},
		cliItemBtn4(out_trade_no, id) {
			uni.showModal({
				title: '提示', content: '确定一键使用？', confirmColor: '#99c043',
				success:res1 => {
					if (res1.confirm) {
						useTheOrder({
							token: uni.getStorageSync('token'),
							out_trade_no, id
						}).then(res2 => {
							this.getDataList0();
							this.$emit('refreshList');
							uni.showToast({
								title: '一键使用成功', duration: 3000
							})
						})
					}
				}
			})
		},
		cliItemBtn5(out_trade_no, id) {
			uni.showModal({
				title: '提示', content: '确定发起退款？', confirmColor: '#99c043',
				success:res1 => {
					if (res1.confirm) {
						isOrderDrawback({
							token: uni.getStorageSync('token'),
							out_trade_no, id
						}).then(res2 => {
							this.getDataList0();
							this.$emit('refreshList');
							uni.showToast({
								title: '退款成功', duration: 3000
							})
						})
					}
				}
			})
		}
	}
}
</script>